{extend name="layout/default" /}
{block name="title"}
<title>{:lang($system['title']??'')} - {:lang('Login')}</title>
{php} $system_full_config = get_module_full_config('system');  {/php}
{/block}
{block name="style"}
<style>
    body {
        background-color: #2d3a4b;
    }
    #login-box {
        margin: 100px auto 0 auto;
        max-width: 550px;
        padding: 50px;
        border-radius: 5px;
        background: #fff;
    }
</style>
{/block}
{block name="content"}
<template id="app">
    <div id="login-box">
        <p class="text-center" style="font-size: 22px;font-weight: bold;">{:lang($system['title'] ?? '')}</p>
        <div class="text-center" style="font-size: 16px;">{:lang('Admin Login')}</div>
        <a-form-model style="margin-top: 30px;" :model="form" ref="ruleForm" :rules="rules" :label-col="{span: 4}" :wrapper-col="{span: 20}">
            <a-form-model-item prop="name" label="{:lang('Username')}">
                <a-input id="username" @keypress.enter="onSubmit" v-model="form.username" placeholder="{:lang('Please input username')}"></a-input>
            </a-form-model-item>
            <a-form-model-item prop="password" label="{:lang('Password')}">
                <a-input-password @keypress.enter="onSubmit" v-model="form.password" placeholder="{:lang('Please input password')}"></a-input-password>
            </a-form-model-item>
            {if count($system_full_config['login_validate']['value']) > 1}
            <div class="text-center" style="margin-bottom: 15px;text-align: right;">
                <span>{:lang('Choose a way to accept captcha')}</span>
                <a-radio-group style="margin-left: 10px;" v-model="form.type">
                    {foreach $system_full_config.login_validate.value as $v}
                    <a-radio value="{$v}"> {:lang($system_full_config['login_validate']['options'][$v])}</a-radio>
                    {/foreach}
                </a-radio-group>
            </div>
            {/if}
            <a-row>
                <a-col :span="4"></a-col>
                <a-col :span="20">
                    <a-button class="btn" :loading="btn_loading" type="danger" style="padding: 0 30px;" @click="onSubmit">{:lang('Login')}</a-button>
                    <a-button class="btn" @click="resetForm">{:lang('Cancel')}</a-button>
                </a-col>
            </a-row>
            <div class="text-center">
            </div>
        </a-form-model>
    
        <a-modal v-model="verify_visible" title="{:lang('Please input captcha')}" @ok="onSubmit">
            <div>
                <a-alert :message="message" style="margin-bottom: 10px;" show-icon></a-alert>
                <a-input v-model="form.code" placeholder="{:lang('Please input captcha')}"></a-input>
            </div>
          </a-modal>
    </div>
</template>


{/block}
{block name="scripts"}
<script>
    var defaultType = '{empty name="$system_full_config.login_validate.value"}{else}{$system_full_config.login_validate.value.0}{/empty}';
    Yi.event.on('SystemAdminLoginMounted', function() {
        $('#username').focus();
    })
</script>
{/block}